<!--agendar cita -->

<!DOCTYPE html>
<? include("../../Sesion/controles/seguridad.php");
?>
<html>
	<head>
		<meta name="viewport" content="width=device-width, initial-scale=1.0">
		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
		<link rel="stylesheet" type="text/css" href="../vistas/css/estilo_citas.css">
		
		<script src="../vistas/js/jquery-ui-1.11.2.custom/external/jquery/jquery.js"></script>
		<script src="../vistas/js/jCombo.js"></script>		
		
		<link rel="stylesheet" type="text/css" href="../vistas/js/fullcalendar/fullcalendar.css"/>
		<link rel="stylesheet" type="text/css" href="../vistas/js/fullcalendar/fullcalendar.print.css" media="print"/>
		<script src="../vistas/js/fullcalendar/lib/moment.min.js"></script>
		<script src="../vistas/js/fullcalendar/lang/es.js"></script>
		<script type='text/javascript' src="../vistas/js/fullcalendar/lib/jquery-ui.custom.min.js"></script>
		<script src="../vistas/js/fullcalendar/fullcalendar.js"></script>
		
		<script src="../vistas/js/scripts_altacitas.js"></script>
		<script src="../vistas/js/sesion_vinculos.js"></script>
		
		<title>Agendar Nueva Cita</title>	</head>
<body>
	<header id="main_header">
		<img id="getron_logo" src="../vistas/img/abc_logo.png" alt="getronTI" onclick="go_to_home()">
		<div id="header_title">
			<h3>GECIME</h3>
			<h4>Gestión de Citas Médicas </h4>
		</div>
		<div id="info_usuario">
			Bienvenido al sistema!:<br><? echo $_SESSION["usuario_actual"]; ?>
			<br><br>
				<a href="../vistas/edit_account.php" title="Editar Cuenta"><img class="btn_sesion" src="../vistas/img/edit_profile.png"></a>
				<a href="../vistas/delete_account.php" title="Eliminar Cuenta"><img class="btn_sesion" src="../vistas/img/delete_profile.png"></a>
				<a href="../../Sesion/controles/salir.php" title="Salir">
					<img class="btn_sesion" src="../vistas/img/exit_profile.png">
				</a>
				<a href="http://www.abchospital.com/contacto/general/nuevo" title="Ayuda" target="_blank">
					<img class="btn_sesion" src="../vistas/img/help.png">
				</a>
		</div>
	</header>
	
	<nav id="navegacion">	
		<a href="../vistas/citas_home.php"><div id="navtitle_inicio">Inicio</div></a>
		<div id="navtitle_agendar">Agendar Cita</div>
		<div id="navtitle_estados">Ver Estados</div>
		<div id="navtitle_historial">Ver Historial</div>
	</nav>
	
	<section id="opciones_agenda">
		<div id="primeros_filtros">
			<h4 style="font-family:Verdana; color: #C40E1F;">Agendar una Nueva Cita</h4>
				<table id="first_data">
				   <tr>
						<td colspan="3" style="border-bottom:1px solid #A7CFF2;
							padding: 5px;">
							Al agendar su cita, te sugerimos llenar paso a paso cada campo pedido, observando y corroborando
							que sean los que eliges. Al guardar la información en el sistema, la cita queda en estado pendiente
							hasta que la confirmes en dentro de 2 horas máximo. Se te recomienda imprimir y llevar tu comprobante el día de tu cita, así como llegar 10 minutos antes para aclararte cualquier duda.
						</td> 
				   </tr>
				   <tr>
						<td style="padding: 5px;">Selecciona un Centro Médico<br><br>
							<select id="combo_centros" name="centro_medico"></select>
							<span id="ft_error"><span>
						</td>
						<td style="padding: 5px;">Selecciona una Especialidad<br><br>
							<select id="combo_esp" name="especialidad"
							style="height: 30px;"></select>
							<span id="ft_error2"><span>
						</td>
						<td>
							<input class="guardar_ediciones" type="button" value="Continuar" id="first_step">
						</td>
				   </tr>
				</table>
        </div>
			
			<section id="content_calendar" style="visibility:hidden; width: 0px; height: 0px;">
				
				<div id="busqueda">
					<span class="span_line">
					<img src="../vistas/img/search.png">
					</span>
					<span class="span_line">
					<h6>busca los días disponibles por doctor (opcional).</h6>
					<h6><span id="ft_error3"></span></h6>
					<select id="search_doctors" name="busqueda_doctores"></select>
					</span>
					
					<span class="span_line">
						<input type="button" class="guardar_ediciones" name="btn_search_doc" value="buscar"
						id="src_doc">
					</span>
					<span id="span_directory">
						<a href="http://www.abchospital.com/medicos" target="_blank"><h6>Ir a directorio</h6></a>
					</span>
				</div>
				
				
				<div id="indicadores">
					<table id="semaforo">
						<tr>
						   <td>
							  <img src="../vistas/img/index_verde.png">
						   </td>
						   <td>
							<h6>Alta Disponibilidad</h6>
						   </td>
						</tr>
						<tr>
						   <td>
							  <img src="../vistas/img/index_amarillo.png">
						   </td>
						   <td>
							 <h6>Poca Disponibilidad</h6>
						   </td>
						</tr>
						<tr>
						   <td>
								<img src="../vistas/img/index_rojo.png">
						   </td>
						   <td>
								<h6>Sin Disponibilidad</h6>
						   </td>
						</tr>
						<tr>
						   <td>
								<img src="../vistas/img/index_grisclaro.png">
						   </td>
						   <td>
								<h6>Días Transcurridos</h6>
						   </td>
						</tr>
						<tr>
						   <td>
								<img src="../vistas/img/index_grisfuerte.png">
						   </td>
						   <td>
								<h6>Días Sin Citas</h6>
						   </td>
						</tr>
					</table>
					<input type="image" id="img_btn_back" src="../../Sesion/vistas/img/back.png"
					style="margin-top: 240px;">
						<div id="btn_back" style="font-family: Verdana; margin-top: 250px;">Regresar</div>
				</div>
				
				
				<div id="subcalendar">
					<h6 style="margin-left: 5%;">Da click en un día disponible</h6>
				    <div id="mycalendar"></div>
				</div>
				<div id="data_hours">
					 <h6>Fecha Selecionada</h6>
					<input type="text" id="date_test" disabled><br><br>
					  <h6>Elige la Hora</h6>
				     <div id="lb_horas"></div>
				     
		             <input class="guardar_ediciones" type="button" name="send_data" id="send_data" value="Aceptar"
		             style="width:70%; height: 35px; margin-top: 380px;">
				</div>
			</section>
			
				
			<section id="result_view" style="display: none;">
				<fieldset>
					<legend align="center">
						<h5>Información de la Cita</h5>
					</legend>
				
				<table id="table_dataresult" style="margin: 0 auto;">
				  <tr>
						<td></td>
						<td style="text-align: right;"><h6>Clave: </h6></td>
				  </tr>
				  <tr>
						<td><h6>Centro Médico: </h6></td>
						<td><h6>Paciente: </h6></td>
				  </tr>
				  <tr>
						<td><h6>Especialidad: </h6></td>
						<td><h6>Fecha de Nacimiento: </h6></td>
				  </tr>
				  <tr>
						<td><h6>Médico: </h6></td>
						<td><h6>Correo Electrónico: </h6></td>
				  </tr>
				  <tr>
						<td><h6>Consultorio: </h6></td>
						<td></td>
				  </tr>
				  <tr>
						<td><h6>Fecha: </h6></td>
						<td></td>
				  </tr>
				  <tr>
						<td><h6>Hora: </h6></td>
						<td></td>
				  </tr>
				  <tr>
						<td><h6>Estado: </h6></td>
						
				  </tr>
				
				</table>
				
				<div id="btns_savedata">
					<input class="guardar_ediciones" type="button" name="cancel_data" id="cancel_data" value="Cancelar"
		             style="width:20%; height: 25px;">
		             <input class="guardar_ediciones" type="button" name="save_data" id="save_data" value="Guardar"
		             style="width:20%; height: 25px;">
		             <input class="guardar_ediciones" type="button" name="pdf_data" id="pdf_data" value="Ver PDF"
		             style="width:20%; height: 25px;">
				</div>
				
				
			   </fieldset>
			</section>
	</section>
	
	<footer id="pie_page">
		<div id="pie_derechos">
			Hospital ABC. Todos los derechos reservados.
			Desarrollado y mantenido por Getron TI.
			México D.F. 2014
		</div>
	</footer>
	
</body>
</html>

